<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>
            <h1>vue引擎</h1>
    </div>

    <script>
        var obj = {
            name:'lucy'
        }
        var value 

        // vue2核心引擎 基础功能  
        // 第一个参数 传入要劫持的对象 进行数据劫持
        // 第二个参数 传入这个对象的key 
        // 第三个参数 对象 里面有相应的处理函数 
        // Object.defineProperty 引擎的核心功能 可以劫持数据 
        Object.defineProperty(obj,'name',{
            get:function() {
                console.log('会在读取劫持数据的时候被调用')
                return value 
            },
            set:function(newvalue) {
                console.log('在设置 写新的数据的时候会调用')
                value = newvalue
            }
        })
        // 核心动作 1 读数据  2 设置新数据
        console.log(obj.name)
        obj.name = 'jack'
        console.log(obj.name)

    </script>
</body>
</html>